<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 1.前置自增运算符 -->
    <script>
        // 想要n一个变量自己加1 num = num + 1不可教麻烦
        var num = 1
        num = num + 1
        console.log(num);
        // 前置自增运算符 ++ 写在变量的前面
        var age = 10
        ++age //类似于 age = age + 1
        console.log(age);
        // 3 先加1 后返回值
        var p = 10
        console.log(++p + 10); //21
    </script>
    <!-- 2.后置自增运算符 -->
        <script>
            // 1.后置自增运算符和前置自增运算符单独使用，效果一样
            // 2.后置自增口诀：先返回值，后自加1
            var age = 10
            console.log(age++ + 10); //20 age先返回值又自加
            console.log(age); //11
        </script>
    <!-- 3.递增运算符联系 -->
         <script>
            var a = 10;
            ++a; //++a = 11，a = 11
            var b = ++a + 2;  //++a是表达式，是表达式就有结果，a = 12，++a = 12
            console.log(b);  //14

            var c = 10;
            c ++; // c++ = 11 ，c = 11
            var d = c++ + 2 //c++是先返回原值后自加，c++表达式先返回原值：c++ = 11，c = 12
            console.log(d);//13

            var e = 10;
            // 1.e++表达式先返回值再自加，e++ = 10,e = 11. 2,++e表达式先自加，再返回，e=12,++e = 12
            var f =e++ + ++e
            console.log(f);//22
            //++前置好理解，表达式和变量值相等
            //后置自加，先表达式返回原值，后面变量再加1
         </script>

         <!--4.比较运算符  -->
         <script>
            console.log(3 >= 5); //false
            console.log(2 <= 4); //true
            //1.程序里面的等于符号是 == 默认转换数据类型
            // 会把字符串类型转换为数字型只要求数值相等
            console.log(3 == 5); //false
            console.log('pink' == '刘德华');
            console.log(18 == 18);//true
            console.log(18 == '18'); //true
            console.log(18 != 18); //false
            //2.程序里面有全等 一摸一样 要求 两侧的值还有
            // 数据类型都要一样
            console.log(18 === 18);
            console.log(18 === '18'); //false
         </script>

         <!-- 5.逻辑运算符 -->
         <script>
            // 1.逻辑 与 两侧都为true 结果才为true
            // 只要有一侧为false 结果就为false
            console.log(3 > 5 && 3 > 2); //false
            console.log(3 < 5 && 3 > 2); //true
            // 2.逻辑或 || 两侧都为false 结果才是假
            // false 只要有一侧为true 结果就是true
            console.log(3 > 5 || 3 > 2); //true
            console.log(3 > 5 || 3 < 2); //false
            // 3.逻辑  非 not
            console.log(!true); //false
         </script>

         <!-- 6.逻辑运算符练习-->
         <script>
            var num = 7
            var str = '我爱你~中国~'
            console.log(num > 5 && str.length >= num);//true
            console.log(num < 5 && str.lenght >= num);//false
            console.log(!(num < 10)); //false
            console.log(!(num < 10 || str.lenght == num)); //false
         </script>

         <!-- 7.短路运算（逻辑中断） -->
         <script>
            // 1.用布尔值参与逻辑运算 true && false == false
            // 2.123 && 456 是值 或者是 表达式 参与逻辑运算
            // 3.逻辑与短路运算 如果表达式1 结果为真，则返回表达式2
            // 如果表达式1为假，则返回表达式1
            console.log(123 && 456);// 456
            console.log(0 && 456);// 0
            // 如果有空的或者否定的为假，其余都是真的  0 '' null undefiend NaN
            // 4.逻辑或短路运算，如果表达式1，结果为真，则返回的是表达式1，
            // 如果表达式1结果为假，则返回表达式2
            console.log(123 || 456); //123
            console.log(0 || 456);//456
            // 逻辑中断很重要 它会影响我们程序运行结果
            var num = 0
            console.log(123 || num++);
            console.log(num); //0
         </script>
</body>
</html>